import { Common } from '@shared';
import { LinkConfig } from 'cxd/showcase/link/config';
import { LayoutConfig } from 'cxd/showcase/layout/config';
import { PaginatorConfig } from 'cxd/showcase/paginator/config';
import { TreeTableConfig } from 'cxd/showcase/tree-table/config';
import { CardConfig } from 'cxd/showcase/card/config';
import { GroupConfig } from 'cxd/showcase/group/config';
import { MenuConfig } from 'cxd/showcase/menu/config';
import { IConConfig } from 'cxd/showcase/icon/config';
import { EmptyConfig } from 'cxd/showcase/empty/config';
import { NotificationConfig } from 'cxd/showcase/notification/config';
import { TableConfig } from 'cxd/showcase/table/config';
import { InputConfig } from 'cxd/showcase/input/config';
import { DrawerConfig } from 'cxd/showcase/drawer/config';
import { DropdownConfig } from 'cxd/showcase/dropdown/config';
import { TreeSelectConfig } from 'cxd/showcase/tree-select/config';
import { LoadingConfig } from 'cxd/showcase/loading/config';
import { SelectConfig } from 'cxd/showcase/select/config';
import { TimelineConfig } from 'cxd/showcase/timeline/config';
import { BreadcrumbConfig } from 'cxd/showcase/breadcrumb/config';
import { TimePickerConfig } from 'cxd/showcase/time-picker/config';
import { OverflowConfig } from 'cxd/showcase/overflow/config';
import { MultiAutocompleteConfig } from 'cxd/showcase/multi-autocomplete/config';
import { DatePickerConfig } from 'cxd/showcase/date-picker/config';
import { BadgeConfig } from 'cxd/showcase/badge/config';
import { CascaderConfig } from 'cxd/showcase/cascader/config';
import { CollapseConfig } from 'cxd/showcase/collapse/config';
import { TreeConfig } from 'cxd/showcase/tree/config';
import { AutocompleteConfig } from 'cxd/showcase/autocomplete/config';
import { SearchConfig } from 'cxd/showcase/search/config';
import { TabsConfig } from 'cxd/showcase/tabs/config';
import { PopoverConfig } from 'cxd/showcase/popover/config';
import { TagConfig } from 'cxd/showcase/tag/config';
import { SliderConfig } from 'cxd/showcase/slider/config';
import { UploadConfig } from 'cxd/showcase/upload/config';
import { AlertConfig } from 'cxd/showcase/alert/config';
import { WizardConfig } from 'cxd/showcase/wizard/config';
import { RadioConfig } from 'cxd/showcase/radio/config';
import { TransferConfig } from 'cxd/showcase/transfer/config';
import { ModalConfig } from 'cxd/showcase/modal/config';
import { ListConfig } from 'cxd/showcase/list/config';
import { CheckboxConfig } from 'cxd/showcase/checkbox/config';
import { SpinnerConfig } from 'cxd/showcase/spinner/config';
import { TooltipConfig } from 'cxd/showcase/tooltip/config';
import { ButtonConfig } from 'cxd/showcase/button/config';
import { OperationMenuConfig } from 'cxd/showcase/operation-menu/config';
import { AdvancedFilterConfig } from 'cxd/showcase/advanced-filter/config';
import { InputIPConfig } from 'cxd/showcase/input-ip/config';
import { ProgressConfig } from 'cxd/showcase/progress/config';
import { FormConfig } from 'cxd/showcase/form/config';
import { SwitchConfig } from 'cxd/showcase/switch/config';
import { TimeSliderConfig } from 'cxd/showcase/time-slider/config';
import { OverlayConfig } from 'cxd/showcase/overlay/config';
import { GridConfig } from 'cxd/showcase/grid/config';
import { InputTagConfig } from 'cxd/showcase/input-tag/config';
import { HighlightConfig } from 'cxd/showcase/highlight/config';

const observableOf = param =>
  new Promise(resolve => {
    resolve(param);
  });

const Router = [
  { path: '', redirectTo: 'develop', pathMatch: 'full' },
  // Develop
  {
    path: 'introduce',
    type: 'develop',
    loadChildren: () => import('../develop/develop.module').then(mod => mod.DevelopModule),
  },
  {
    path: 'get-start',
    type: 'develop',
    loadChildren: () => import('../develop/develop.module').then(mod => mod.DevelopModule),
  },
  {
    path: 'global-config',
    type: 'develop',
    loadChildren: () => import('../develop/develop.module').then(mod => mod.DevelopModule),
  },
  {
    path: 'faq',
    type: 'develop',
    loadChildren: () => import('../develop/develop.module').then(mod => mod.DevelopModule),
  },
  // General
  {
    path: 'button',
    type: 'general',
    loadChildren: () => import('../../showcase/button/button.module').then(mod => mod.ButtonDemoModule),
    data: observableOf(ButtonConfig),
  },
  {
    path: 'grid',
    type: 'general',
    loadChildren: () => import('../../showcase/grid/grid.module').then(mod => mod.GridDemoModule),
    data: observableOf(GridConfig),
  },
  {
    path: 'group',
    type: 'general',
    loadChildren: () => import('../../showcase/group/group.module').then(mod => mod.GroupDemoModule),
    data: observableOf(GroupConfig),
  },
  {
    path: 'icon',
    type: 'general',
    loadChildren: () => import('../../showcase/icon/icon.module').then(mod => mod.IconDemoModule),
    data: observableOf(IConConfig),
  },
  {
    path: 'layout',
    type: 'general',
    loadChildren: () => import('../../showcase/layout/layout.module').then(mod => mod.LayoutDemoModule),
    data: observableOf(LayoutConfig),
  },
  {
    path: 'link',
    type: 'general',
    loadChildren: () => import('../../showcase/link/link.module').then(mod => mod.LinkDemoModule),
    data: observableOf(LinkConfig),
  },
  {
    path: 'overlay',
    type: 'general',
    loadChildren: () => import('../../showcase/overlay/overlay.module').then(mod => mod.OverlayDemoModule),
    data: observableOf(OverlayConfig),
  },
  // Navigator
  {
    path: 'breadcrumb',
    type: 'navigator',
    loadChildren: () => import('../../showcase/breadcrumb/breadcrumb.module').then(mod => mod.BreadcrumbDemoModule),
    data: observableOf(BreadcrumbConfig),
  },
  {
    path: 'menu',
    type: 'navigator',
    loadChildren: () => import('../../showcase/menu/menu.module').then(mod => mod.MenuDemoModule),
    data: observableOf(MenuConfig),
  },
  {
    path: 'paginator',
    type: 'navigator',
    loadChildren: () => import('../../showcase/paginator/paginator.module').then(mod => mod.PaginatorDemoModule),
    data: observableOf(PaginatorConfig),
  },
  {
    path: 'wizard',
    type: 'navigator',
    loadChildren: () => import('../../showcase/wizard/wizard.module').then(mod => mod.WizardDemoModule),
    data: observableOf(WizardConfig),
  },
  // DataEntry
  {
    path: 'advanced-filter',
    name: 'advancedFilter',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/advanced-filter/advanced-filter.module').then(mod => mod.AdvancedFilterDemoModule),
    data: observableOf(AdvancedFilterConfig),
  },
  {
    path: 'autocomplete',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/autocomplete/autocomplete.module').then(mod => mod.AutocompleteDemoModule),
    data: observableOf(AutocompleteConfig),
  },
  {
    path: 'cascader',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/cascader/cascader.module').then(mod => mod.CascaderDemoModule),
    data: observableOf(CascaderConfig),
  },
  {
    path: 'checkbox',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/checkbox/checkbox.module').then(mod => mod.CheckboxDemoModule),
    data: observableOf(CheckboxConfig),
  },
  {
    path: 'date-picker',
    name: 'datePicker',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/date-picker/date-picker.module').then(mod => mod.DatePickerDemoModule),
    data: observableOf(DatePickerConfig),
  },
  {
    path: 'dropdown',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/dropdown/dropdown.module').then(mod => mod.DropdownDemoModule),
    data: observableOf(DropdownConfig),
  },
  {
    path: 'form',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/form/form.module').then(mod => mod.FormDemoModule),
    data: observableOf(FormConfig),
  },
  {
    path: 'input',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/input/input.module').then(mod => mod.InputDemoModule),
    data: observableOf(InputConfig),
  },
  {
    path: 'input-ip',
    name: 'inputIP',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/input-ip/input-ip.module').then(mod => mod.InputIPDemoModule),
    data: observableOf(InputIPConfig),
  },
  {
    path: 'input-tag',
    name: 'inputTag',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/input-tag/input-tag.module').then(mod => mod.InputTagModule),
    data: observableOf(InputTagConfig),
  },
  {
    path: 'multi-autocomplete',
    name: 'multiAutocomplete',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/multi-autocomplete/multi-autocomplete.module').then(mod => mod.MultiAutocompleteDemoModule),
    data: observableOf(MultiAutocompleteConfig),
  },
  {
    path: 'operation-menu',
    name: 'operationMenu',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/operation-menu/operation-menu.module').then(mod => mod.OperationMenuDemoModule),
    data: observableOf(OperationMenuConfig),
  },
  {
    path: 'radio',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/radio/radio.module').then(mod => mod.RadioDemoModule),
    data: observableOf(RadioConfig),
  },
  {
    path: 'search',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/search/search.module').then(mod => mod.SearchDemoModule),
    data: observableOf(SearchConfig),
  },
  {
    path: 'select',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/select/select.module').then(mod => mod.SelectDemoModule),
    data: observableOf(SelectConfig),
  },
  {
    path: 'slider',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/slider/slider.module').then(mod => mod.SliderDemoModule),
    data: observableOf(SliderConfig),
  },
  {
    path: 'spinner',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/spinner/spinner.module').then(mod => mod.SpinnerDemoModule),
    data: observableOf(SpinnerConfig),
  },
  {
    path: 'switch',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/switch/switch.module').then(mod => mod.SwitchDemoModule),
    data: observableOf(SwitchConfig),
  },
  {
    path: 'time-picker',
    name: 'timePicker',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/time-picker/time-picker.module').then(mod => mod.TimePickerDemoModule),
    data: observableOf(TimePickerConfig),
  },
  {
    path: 'time-slider',
    name: 'timeSlider',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/time-slider/time-slider.module').then(mod => mod.TimeSliderDemoModule),
    data: observableOf(TimeSliderConfig),
  },
  {
    path: 'transfer',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/transfer/transfer.module').then(mod => mod.TransferDemoModule),
    data: observableOf(TransferConfig),
  },
  {
    path: 'tree-select',
    name: 'treeSelect',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/tree-select/tree-select.module').then(mod => mod.TreeSelectDemoModule),
    data: observableOf(TreeSelectConfig),
  },
  {
    path: 'upload',
    type: 'dataEntry',
    loadChildren: () => import('../../showcase/upload/upload.module').then(mod => mod.UploadDemoModule),
    data: observableOf(UploadConfig),
  },
  // DataDisplay
  {
    path: 'badge',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/badge/badge.module').then(mod => mod.BadgeDemoModule),
    data: observableOf(BadgeConfig),
  },
  {
    path: 'card',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/card/card.module').then(mod => mod.CardDemoModule),
    data: observableOf(CardConfig),
  },
  {
    path: 'collapse',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/collapse/collapse.module').then(mod => mod.CollapseDemoModule),
    data: observableOf(CollapseConfig),
  },
  {
    path: 'drawer',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/drawer/drawer.module').then(mod => mod.DrawerDemoModule),
    data: observableOf(DrawerConfig),
  },
  {
    path: 'list',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/list/list.module').then(mod => mod.ListDemoModule),
    data: observableOf(ListConfig),
  },
  {
    path: 'modal',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/modal/modal.module').then(mod => mod.ModalDemoModule),
    data: observableOf(ModalConfig),
  },
  {
    path: 'overflow',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/overflow/overflow.module').then(mod => mod.OverflowDemoModule),
    data: observableOf(OverflowConfig),
  },
  {
    path: 'popover',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/popover/popover.module').then(mod => mod.PopoverDemoModule),
    data: observableOf(PopoverConfig),
  },
  {
    path: 'table',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/table/table.module').then(mod => mod.TableDemoModule),
    data: observableOf(TableConfig),
  },
  {
    path: 'tabs',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/tabs/tabs.module').then(mod => mod.TabsDemoModule),
    data: observableOf(TabsConfig),
  },
  {
    path: 'tag',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/tag/tag.module').then(mod => mod.TagDemoModule),
    data: observableOf(TagConfig),
  },
  {
    path: 'timeline',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/timeline/timeline.module').then(mod => mod.TimeLineDemoModule),
    data: observableOf(TimelineConfig),
  },
  {
    path: 'tooltip',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/tooltip/tooltip.module').then(mod => mod.TooltipDemoModule),
    data: observableOf(TooltipConfig),
  },
  {
    path: 'tree',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/tree/tree.module').then(mod => mod.TreeDemoModule),
    data: observableOf(TreeConfig),
  },
  {
    path: 'tree-table',
    name: 'treeTable',
    type: 'dataDisplay',
    loadChildren: () => import('../../showcase/tree-table/tree-table.module').then(mod => mod.TreeTableDemoModule),
    data: observableOf(TreeTableConfig),
  },
  // FeedBack
  {
    path: 'alert',
    type: 'feedBack',
    loadChildren: () => import('../../showcase/alert/alert.module').then(mod => mod.AlertDemoModule),
    data: observableOf(AlertConfig),
  },
  {
    path: 'empty',
    type: 'feedBack',
    loadChildren: () => import('../../showcase/empty/empty.module').then(mod => mod.EmptyModule),
    data: observableOf(EmptyConfig),
  },
  {
    path: 'loading',
    type: 'feedBack',
    loadChildren: () => import('../../showcase/loading/loading.module').then(mod => mod.LoadingDemoModule),
    data: observableOf(LoadingConfig),
  },
  {
    path: 'notification',
    type: 'feedBack',
    loadChildren: () => import('../../showcase/notification/notification.module').then(mod => mod.NotificationDemoModule),
    data: observableOf(NotificationConfig),
  },
  {
    path: 'progress',
    type: 'feedBack',
    loadChildren: () => import('../../showcase/progress/progress.module').then(mod => mod.ProgressDemoModule),
    data: observableOf(ProgressConfig),
  },
  {
    path: 'highlight',
    type: 'others',
    loadChildren: () => import('../../showcase/highlight/highlight.module').then(mod => mod.HightLightDemoModule),
    data: observableOf(HighlightConfig),
  },
  {
    path: 'area-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
  {
    path: 'bar-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
  {
    path: 'donut-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
  {
    path: 'gauge-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
  {
    path: 'line-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
  {
    path: 'radar-chart',
    type: 'visualization',
    loadChildren: () => import('../charts/charts.module').then(mod => mod.ChartsModule),
  },
];

const index = location.href.includes(Common.BASE_URL) ? location.href.indexOf(Common.BASE_URL) - 1 : 1000;
export const APIHost = `${location.href.slice(0, index)}/src/app`;
export const AppContentRouter = Router;
